<template>
  <div id="about">
	  <div style="flex: 6;">
		  <div v-for="(item,index) in showdata" :key = "index">
			  <div class="title">{{item.title}}</div>
			  <div class="text">{{item.text}}</div>
		  </div>
	  </div>
	  <rightBar style="flex: 2;"></rightBar>
  </div>
</template>
 
<script>
	import rightBar from './rightBar.vue'
	export default {
		  name: 'about',
		  components: {
			 rightBar 
		  },
		  data(){
			  return{
				  showdata : [
					  {
						  title:'关于博客',
						  text:'本博客用于记录平时工作和学习中的知识点，总结经验，用于分享。如有错误地方烦请指正。\n博客重点在于分享web前端开发知识，或涉其它。'
					  },
					  {
						  title:'关于作者',
						  text:'Name: 郑勇涛\nEmail: yongtaozheng0201@163.com\nQQ: 1311395125\nGitHub: yongtaozheng'
					  }
				  ]
			  }
		  },
		  methods:{
			  
		  }
	}
</script>
 
<style>
	#about{
		margin: 0 auto;
		margin-top: 10vh;
		margin-left: 10vw;
		text-align: left;
		color: antiquewhite;
		display: flex;
		flex-direction: row;
		width: 80vw;
	}
	#about .title{
		font-size: large;
		font-weight: bold;
		margin-bottom: 1rem;
		margin-top: 3rem;
	}
	#about .text{
		margin-top: 0.5rem;
		white-space: pre-line;
		line-height: 2rem;
	}
	
</style>